<template>
  <div class="box">
    <h1>ShopGo Login</h1>
    <el-input
        placeholder="请输入用户名"
        v-model="input"
        clearable>
    </el-input>
    <el-input
        placeholder="请输入密码"
        v-model="psssword"
        clearable>
    </el-input>
    <el-input
        placeholder="请再次输入密码"
        v-model="repassword"
        clearable>
    </el-input>
    <el-button type="success">Login</el-button>
  </div>
</template>

<script>
export default {
  name: "Login",
  data(){
    return{
      username: '',
      psssword: '',
      repassword: ''
    }
  }
}
</script>

<style scoped lang='less'>
.box{
  width: 500px;
  height: 350px;
  background-color: lightblue;

  margin: 100px auto;
  padding: 20px;

  border: 2px solid lavenderblush;
  border-radius: 30px;

  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;


  :deep(.el-input--suffix){
    width: 400px;
  }
}
</style>
